<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <script src="js/axios.js"></script>
    <script src="js/jquery.js"></script>
    <script>
        $(function() {
            $('#btn1').click(function() {
                axios.get('http://127.0.0.1:3001/a1').then(ret => {
                    console.log('按钮1数据获取成功')
                    console.log(ret)
                })
            })
            $('#btn2').click(function() {
                axios.get('http://127.0.0.1:3001/a2').then(ret => {
                    console.log('按钮2数据获取成功')
                    console.log(ret)
                })
            })
            $('#btn3').click(function() {
                axios.get('http://127.0.0.1:3001/a3').then(ret => {
                    console.log('按钮3数据获取成功')
                    console.log(ret)
                })
            })
        })
        axios.defaults.baseURL = 'http://127.0.0.1:3001'
        axios.defaults.headers['mytoken'] = 'haha'
        axios.interceptors.response.use(function(data) {
                data.data.code = 200
                return data.data
            })
            // 需求1: 每次都要写http://127.0.0.1:3001,好烦,有没有办法统一配置
            // 需求2: 每个请求, 我都想加上请求头 mytoken=haha
            // 需求3: 每个axios所发的请求, 从服务器得到的数据, 我想在其基础之上加上code=200的数据, 该怎么实现
            // 需求4: 使用axios时,每次写的.then中的ret,完完全全是服务器所返回的数据吗? 怎样让ret完完全全是服务器所返回的数据
    </script>
</head>

<body>
    <button id="btn1">发起第一个请求</button>
    <button id="btn2">发起第二个请求</button>
    <button id="btn3">发起第三个请求</button>
</body>

</html>